<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="/jQuery_class_stu/jquery.js">

</script>

<script type="text/javascript">
//page 로딩되면 매개변수로 전달한 함수를 실행
$(document).ready(function(){
	//selector로 조회한 dom에 1번매개변수("click") 이벤트를 처리할 2번 매개변수(함수) 등록
	$("#chk").bind("click",function(){
		//alert("체크박스 클릭");
		//이벤트 처리 함수에서 Event소스에 접근 : this -> 실제 이벤트가 발생한 객체 
		if(this.checked){
			alert("메일 수신을 합니다.");
		}else {
			alert("메일을 수신하지 않습니다.");
		}
	});
	
	$("#btn").on("click",function(){
		alert("버튼클릭");
	});
	$("a").on("mouseover",function(){
		$(this).css("text-decoration","underline");
	}).on("mouseout",function(){
		$(this).css("text-decoration","none");
	});
	
	$("li").hover(function(){
		$(this).css("text-decoration","line-through");//underline, line-through, overline, none
	}, function(){
		$(this).css("text-decoration","none");
		
	});
});
</script>


<style type="text/css">
	a{
		text-decoration: none;
	}
	li{
		width:100px;
	}
</style>
</head>
<body> 
메일 수신여부 : 
<input type="checkbox" name="mailing" value="true" id="chk"><br>
<input type="button" value="click" id="btn">
<p>
<a href="http://www.google.com">구글</a>
<a href="http://www.daum.net">다음</a>
</p>
<ul>
	<li>우유</li>
	<li>빵</li>
	<li>두유</li>
	<li>쿠키</li>
	<li>탄산음료</li>
</ul>
</body>
</html>







